<template>
	<view>
		<scroll-view class="shopListBox" scroll-y="true">
			<view class="shopList" v-for="(item,index) in shopList" :style="index == shopList.length - 1 ? 'border-bottom:0;':''" @tap="goto" :data-url="'../../admin/product/index?bid='+item.id">
				<view class="stateBox">
					<text v-show="item.status == 0">待审核</text>
					<text v-show="item.refund_status == 1">退款中</text>
					<text v-show="item.refund_status == 2">已退款</text>
				</view>
				<image :src="item.logo"></image>
				<view class="shopContent">
					<view class="shopName">商铺名称：{{item.name}}</view>
					<view class="shopName">
						<text>主营类目：</text>
						<text class="category">{{item.cate_name}}</text>
					</view>
					<view class="shopName" v-show="item.status == 2">驳回理由：{{item.reason}}</view>
				</view>
				<view class="operationBox">
					<view class="t0" @click.stop="refundBtn(item,index)" v-show="item.refund_status == 0">申请退款</view>
					<view class="t1" @click.stop="payBtn(item,index)" v-show="item.ensure_status == 0">支 付</view>
					<view class="t2" @click.stop="modifyBtn(item,index)">修 改</view>
				</view>
			</view>
		</scroll-view>
		<loading v-if="loading"></loading>
	</view>
</template>
<script>
	var app = getApp();
	export default {
		data() {
			return {
				loading:false,
				shopList:[],//店铺list
			}
		},

		mounted() {
			this.getShopListFun();
		},

		methods: {
			//驳回理由
			reject(){
				uni.showModal({
					title: '驳回理由',
					content: '图片模糊看不清楚 店铺名称涉嫌违法，商铺介绍涉嫌诈骗，黄色，政治铭感信息等，请速速修改提交！',
					showCancel:false,
					success: function(res) {	
						if (res.confirm) {
							
						}
					}
				});
			},
			
			//修改按钮
			modifyBtn(item,index){
				app.goto('/pagesExt/business/apply?bid='+item.id+'');
			},
			
			//申请退款按钮
			refundBtn(item,index){
				let _this = this;
				uni.showModal({
					title: '操作提示',
					content: '退款将下架本商品内所有商品,请谨慎选择,是否需要退款?',
					success: function(res) {
						if (res.confirm) {
							_this.loading = true;
							app.post('ApiStore/refund_ensure', {bid:item.id}, function(res) {
								_this.loading = false;
								app.success('退款申请已提交');
								_this.shopList[index].refund_status = 1;
							});
						}
					}
				});
				
			},
			
			//支付按钮
			payBtn(item,index){
				let _this = this;
				this.loading = true;
				app.get('ApiStore/apply_ensure_business', {bid:item.id}, function(res) {
					console.log(res.pay_data);
					_this.loading = false;
					uni.requestPayment({
						'timeStamp': res.pay_data.timeStamp,
						'nonceStr': res.pay_data.nonceStr,
						'package': res.pay_data.package,
						'signType': 'MD5',
						'paySign': res.pay_data.paySign,
						'success': function(res) {
							app.success('付款完成');
							_this.shopList[index].ensure_status = 1;
						},
						'fail': function(res) {
							app.error('取消支付');
						}
					});
				});
			},
			
			//获取商铺列表
			getShopListFun(){
				let _this = this;
				app.get('ApiStore/ensure_business_list', {}, function(res) {
					_this.shopList = res.list;
				});
			},
		}
	}
</script>

<style lang="less">
	page {
		background-color: #f3f3f3;
	}
	
	.stateBox{
		width:100%;
		float:left;
		display: flex;
		justify-content:flex-end;
	}
	
	.stateBox text{
		padding:5rpx 20rpx;
		background-color: #FC4C48;
		margin:0 0 15rpx 20rpx;
		border-radius: 7rpx;
		color:#fff;
	}

	.operationBox {
		width: 100%;
		float: left;
		display: flex;
		justify-content: flex-end;
		color: #fff;
		border-top: 1px solid #eaeaea;
		padding-top:25rpx;
		margin-top: 10rpx;
	}
	
	.operationBox .t0 {
		width:140rpx;
		float:left;
		background-color: #fff;
		border: 1px solid #ccc;
		color: #ccc;
		border-radius: 10rpx;
		padding: 8rpx 0;
		text-align: center;
	}

	.operationBox .t1 {
		width:140rpx;
		float:left;
		background-color: #fff;
		border: 1px solid #FC4C48;
		color: #FC4C48;
		margin-left: 30rpx;
		border-radius: 10rpx;
		padding: 8rpx 0;
		text-align: center;
	}

	.operationBox .t2 {
		width:140rpx;
		float:left;
		background-color: #FC4C48;
		margin-left: 30rpx;
		border-radius: 10rpx;
		line-height: 60rpx;
		text-align: center;
	}
	
	.category{
		padding:5rpx 25rpx;
		background-color: #F59E2E;
		border-radius: 5rpx;
		color:#fff;
		// margin-left:5rpx;
	}

	.shopListBox {
		width: 94%;
		float: left;
		margin: 0 3%;
		height: calc(100vh - 20rpx);
	}

	.shopList {
		width: 100%;
		float: left;
		background-color: #fff;
		margin-top: 25rpx;
		padding: 30rpx 3% 25rpx 3%;
		display: flex;
		flex-wrap: wrap;
		align-items: center;
		border-radius: 10rpx;
		font-size: 28rpx;
	}

	.shopAddress {
		width: 100%;
		display: flex;
		justify-content: space-between;
	}

	.shopAddress view {
		width: 80%;
		float: left;
		overflow: hidden; //超出文本隐藏
		text-overflow: ellipsis; //溢出使用省略号显示
		white-space: nowrap; // 默认不换行；
	}

	.shopList image {
		width: 150rpx;
		height: 150rpx;
	}

	.shopContent {
		width: calc(100% - 170rpx);
		float: left;
		margin-left: 20rpx;
		font-size: 26rpx;
		color: #939393;
		line-height: 75rpx;
	}

	.shopName {
		width:100%;
		float:left;
		color: #000;
		font-size: 28rpx;
		display: -webkit-box;
		-webkit-box-orient: vertical;
		overflow: hidden;
		text-overflow: ellipsis;
		-webkit-line-clamp: 2;
	}
</style>